

{#{% extends 'base/base.html' %}#}
{##}
{#{% block content %}#}
{#<div class="container" style="margin-top: 20px;">#}
{#    <div class="row">#}
{#        <div class="col-md-8 col-md-offset-2">#}
{#            <div class="panel panel-default">#}
{#                <div class="panel-heading">#}
{#                    <h3 class="panel-title">我的收藏</h3>#}
{#                </div>#}
{#                <div class="panel-body">#}
{#                    {% if collections %}#}
{#                        <ul class="list-group">#}
{#                            {% for collect in collections %}#}
{#                                <li class="list-group-item">#}
{#                                    <div class="pull-right">#}
{#                                        <a href="{% url 'main:question_detail' collect.question.id %}" class="btn btn-sm btn-primary">详情</a>#}
{#                                        <span class="text-muted" style="margin-left: 10px;">{{ collect.created_at|date:"Y-m-d H:i:s" }}</span>#}
{#                                    </div>#}
{#                                    <div style="margin-right: 160px;">{{ collect.question.title }}</div>#}
{#                                </li>#}
{#                            {% endfor %}#}
{#                        </ul>#}
{#                    {% else %}#}
{#                        <p class="text-center text-muted">暂无收藏内容</p>#}
{#                    {% endif %}#}
{#                </div>#}
{#            </div>#}
{#            <a href="{% url 'main:home' %}" class="btn btn-default">返回主页</a>#}
{#        </div>#}
{#    </div>#}
{#</div>#}
{#{% endblock %}#}

{% extends 'base/base.html' %}

{% block content %}
<div class="container" style="margin-top: 30px; margin-bottom: 50px;">
    <!-- 页面标题 -->
    <div class="row">
        <div class="col-md-10 col-md-offset-1">
            <h2 class="page-header" style="border-bottom: 2px solid #337ab7; padding-bottom: 10px;">
                <i class="glyphicon glyphicon-star text-warning"></i> 我的收藏
            </h2>
        </div>
    </div>

    <!-- 收藏列表卡片 -->
    <div class="row">
        <div class="col-md-10 col-md-offset-1">
            <div class="panel panel-default">
                <!-- 列表头部 -->
                <div class="panel-heading bg-primary text-white">
                    <div class="row">
                        <div class="col-md-8"><strong>内容标题</strong></div>
                        <div class="col-md-2 text-center"><strong>收藏时间</strong></div>
                        <div class="col-md-2 text-center"><strong>操作</strong></div>
                    </div>
                </div>

                <!-- 列表内容 -->
                <div class="panel-body" style="padding: 0;">
                    {% if collections %}
                        <div class="list-group">
                            {% for collect in collections %}
                                <div class="list-group-item" style="border-radius: 0; border-left: none; border-right: none;">
                                    <div class="row">
                                        <!-- 标题区域 -->
                                        <div class="col-md-8">
                                            <a href="{% url 'main:question_detail' collect.question.id %}"
                                               class="text-primary"
                                               style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block;">
                                                {{ collect.question.title }}
                                            </a>
                                        </div>

                                        <!-- 时间区域 -->
                                        <div class="col-md-2 text-center text-muted">
                                            {{ collect.created_at|date:"Y-m-d H:i" }}
                                        </div>

                                        <!-- 操作按钮区域 -->
                                        <div class="col-md-2 text-center">
                                            <a href="{% url 'main:question_detail' collect.question.id %}"
                                               class="btn btn-xs btn-primary">
                                                <i class="glyphicon glyphicon-eye-open"></i> 详情
                                            </a>
{#                                            <a href="{% url 'delete_collection' collect.id %}"#}
{#                                               class="btn btn-xs btn-danger"#}
{#                                               onclick="return confirm('确定要取消收藏吗？')">#}
{#                                                <i class="glyphicon glyphicon-trash"></i> 取消#}
{#                                            </a>#}
                                        </div>
                                    </div>
                                </div>
                            {% endfor %}
                        </div>
                    {% else %}
                        <!-- 空状态提示 -->
                        <div class="text-center" style="padding: 50px 0; color: #777;">
                            <i class="glyphicon glyphicon-folder-open" style="font-size: 50px; margin-bottom: 20px;"></i>
                            <p style="font-size: 16px;">暂无收藏内容</p>
                            <a href="{% url 'main:home' %}" class="btn btn-default btn-sm" style="margin-top: 10px;">
                                去浏览内容
                            </a>
                        </div>
                    {% endif %}
                </div>

                <!-- 分页（如果需要） -->
                {% if is_paginated %}
                <div class="panel-footer text-center">
                    <nav>
                        <ul class="pagination pagination-sm">
                            <!-- 分页逻辑 -->
                        </ul>
                    </nav>
                </div>
                {% endif %}
            </div>

            <!-- 返回按钮 -->
            <div class="text-center" style="margin-top: 20px;">
                <a href="{% url 'main:home' %}" class="btn btn-default">
                    <i class="glyphicon glyphicon-arrow-left"></i> 返回主页
                </a>
            </div>
        </div>
    </div>
</div>
{% endblock %}